<template>
	<view>
		<uni-list-item title="头像" @click="changeAvatar" clickable showArrow>
			<view class="flex align-center" slot="footer">
			<image  :src="avatar" style="width:100rpx ;height:100rpx;" class="border-circle"></image>
		      <text class="iconfont icon-bianji ml-2"></text>
			</view>
		</uni-list-item>
		<uni-list-item title="昵称"  clickable showArrow>
			<view class="flex align-center" slot="footer">
			<input class="uni-input text-right" v-model="username" />
			<text class="iconfont icon-bianji ml-2"></text>
			</view>
		</uni-list-item>
		<uni-list-item title="性别" @click="changeSex" clickable showArrow>
			<view class="flex align-center" slot="footer">
			<text>{{sex}}</text>
			<text class="iconfont icon-bianji ml-2"></text>
			</view>
		</uni-list-item>
		<uni-list-item title="专业" showArrow>
			<view class="flex align-center" slot="footer">
			<input class="uni-input text-right" v-model="major" />
			<text class="iconfont icon-bianji ml-2"></text>
			</view>
		</uni-list-item>
		<uni-list-item title="年龄" showArrow>
			<view class="flex align-center" slot="footer">
			<input class="uni-input text-right" v-model="age" />
			<text class="iconfont icon-bianji ml-2"></text>
			</view>
		</uni-list-item>
		<view class="py-2 px-3">
			<button class="bg-main text-white" style="border-radius: 50rpx; border: 0;" type="primary" @click="submit" >确认</button>
		</view>
	</view>
</template>

<script>
	import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
	const sexArray =['男', '女']
	export default {
		components:{
			uniListItem
		},
		data() {
			return {
			 userId:'',
			 avatar:'',
			 username:'ss',
			 sex:'男',
			 major:'软件工程',
			 age:''
			}
		},
		onLoad() {
			let userInfo = JSON.parse(uni.getStorageSync("userInfo"))
			this.avatar = userInfo.avatar
			this.username = userInfo.userName
			this.sex = sexArray[userInfo.sex]
			this.major = userInfo.major
			this.age = userInfo.age
			this.userId = userInfo.userId
		},
		methods: {
			changeAvatar(){
				uni.chooseImage({
					count:1,
					sizeType:['compressed'],
					sourceType:['album','camera'],
					success: (res) => {
						uni.uploadFile({
							 url: this.$configPath.webUrl+'/common/upload',  //仅为示例，非真实的接口地址
							filePath: res.tempFilePaths[0],
							name: 'file',
							header:{
								"Authorization":uni.getStorageSync("token")
							},
							success: (uploadFileRes) => {
								console.log(JSON.parse(uploadFileRes.data))
							    this.avatar=JSON.parse(uploadFileRes.data).url
							}
						});
					}
				})
			},
			changeSex(){
				uni.showActionSheet({
				    itemList: sexArray,
				    success:(res) =>{
						this.sex = sexArray[res.tapIndex]
						console.log(this.sex)
				    }
				});
			},
			submit(){
				this.$R.put("/system/user",{userId:this.userId,avatar:this.avatar,userName:this.username,sex:this.sex,major:this.major,age:this.age})
				.then((res)=>{
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					if(res.code== 200){
						this.$R.get('/system/user/'+this.userId).then((res) => {
							console.log(res)
							if(res.code==200){
								this.$store.commit("loginUser", res.data)
							}
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						})
					}
				})
			}
		}
	}
</script>

<style>

</style>
